<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>UGame</title>
    <script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
	<script type="text/javascript" src="js/jquery.pngFix.js"></script>
	<script type="text/javascript" src="js/mopSlider-2.5.js"></script>
    <link rel="stylesheet" href="css/style.css" type="text/css"/>
    <style type="text/css">
        div#main{
            width: 100%;
            position: relative;
            float: left;
        }
        div#register{
            position: relative;
            width: 160px;
            height: 130px;
            margin: 0px auto;
            padding: 10px 0px;
        }
        div#register div.login-input{
            background: url('images/login-input-bg.png') no-repeat center;
            width: 150px;
            height: 24px;
            margin: 1px 5px;
            float: left;
        }
        div#register div.login-input input[type="text"]{
            width: 140px;
            height: 18px;
            border: none;
            margin: 3px;
            padding: 0px 2px;
            color: #3a4f00;
            font-size: 10px;
            font-style: italic;
            font-weight: bold;
        }
        div#register a{
            background: url('images/login-btn-bg.png') no-repeat center;
            display: block;
            float: left;
            width: 74px;
            line-height: 24px;
            font-size: 10px;
            font-weight:600;
            color: white;
            text-align: center;
            margin: 2px 0px 0px 4px;
            text-shadow: 0px -1px #2d4366;
        }
    </style>
</head>
<body>
<div id="wrapper">
<div id="header">
    <img id="dragon" src="images/dragon.png" alt="">

    <div id="action-panel">
        <a id="btn-language" onclick="return false" href="#" style="margin-right: 3px">
            <img src="images/en-US.png" alt="">
        </a>
        <a id="btn-login" onclick="return false" href="#">
            <img src="images/account-icon.png" alt="">
        </a>
        <a id="btn-search" onclick="return false" href="#">
            <img src="images/search-icon.png" alt="">
        </a>
    </div>
    <!-- End #action-panel -->
    <div id="logo-panel">
        <div id="logo">
        </div><!-- End #logo -->
    </div>
    <!-- End #logo-panel -->

    <div id="search-panel">
        <div class="left-search">

        </div>
        <!-- End .left-search -->
        <div class="center-search">
            <input type="text" id="search-content"/>
        </div>
        <!-- End .center-search -->
        <div class="right-search">
            <a id="cancel-search" href="#"></a>
            <a id="submit-search" href="#">Search</a>
        </div>
        <!-- End .right-search -->
    </div>
    <!-- End #search-panel -->
    <div id="login-panel">
        <div class="login-input">
            <input type="text" value="email"/>
        </div>
        <div class="login-input">
            <input type="text" value="password"/>
        </div>
        <a id="sign-in" href="#">Sign in</a>
        <a href="#">Sign up</a>
    </div>
    <!-- End login-panel -->
    <div id="language-panel">
        <a class="language-item" href="#">
            <span>English</span>
            <img class="language-icon" id="en-US" src="images/en-US.png" alt=""/>
        </a>
        <a class="language-item" href="#">
            <span>Vietnamese</span>
            <img class="language-icon" id="vi-VN" src="images/vi-VN.png" alt=""/>
        </a>
    </div>
    <!-- End language-panel -->
    <div id="main-nav">
        <table cellpadding="0" cellspacing="0">
            <tr>
                <td class="active"><a href="#">News</a></td>
                <td><a href="#">Store</a></td>
                <td><a href="#">Forum</a></td>
            </tr>
        </table>
    </div>
    <!-- End #main-nav -->
</div>
<!-- End #header -->

<div id="main">
    <div id="register">
        <div class="login-input">
            <input type="text" id="txtUserName" value="username"/>
        </div>
        <div class="login-input">
            <input type="text" id="txtPassword" value="password"/>
        </div>
        <div class="login-input">
            <input type="text" id="txtConfirmPassword" value="confirm password"/>
        </div>
        <div class="login-input">
            <input type="text" id="txtPhoneNumber" value="phone number"/>
        </div>
        <a href="#" id="sign-up">Sign up</a>
        <a href="#">Cancel</a>
    </div><!-- End #register -->
</div><!-- End #main -->

<div id="footer">
    <div id="banner">
    </div><!-- End #banner -->
    <div class="service-title" id="service-title-en-US">
    </div>
    <!-- End #service-title -->
    <div id="service-content">
        <div id="footer-logo">
        </div><!-- End #footer-logo -->
        <p id="copy-right">POWERED BY trunggt4</p>
        <a href="#" class="service" id="email"></a>
        <a href="#" class="service" id="phone"></a>
    </div>
    <!-- End #service -->
</div>
<!-- End #footer -->

<div class="clear"></div>
</div>
<!-- End #wrapper-->
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript">
    $.fn.addFocusHandlerOnTextField = function(options){
        var value = options["value"];

        $(this).focusout(function() {
            if($(this).val() == ""){
                $(this).val(value);
            }
        }).focus(function() {
                $(this).val("");
        });
    }

    $("#txtUserName").addFocusHandlerOnTextField({
        value: "username"
    });
    $("#txtPassword").addFocusHandlerOnTextField({
        value: "password"
    });
    $("#txtConfirmPassword").addFocusHandlerOnTextField({
        value: "confirm password"
    });
    $("#txtPhoneNumber").addFocusHandlerOnTextField({
        value: "phone number"
    });
</script>
</body>
</html>